<template>
  <base_com>
    <div>
      <trade_header></trade_header>
      <trade_bottom></trade_bottom>
      <!--<trade_main></trade_main>-->
      <strategy_sidebar ></strategy_sidebar>
    </div>
  </base_com>
</template>

<script>
  import base_com from '_c/base-com'
  import Trade_header from "@/components/trade/trade_header/trade_header";
  import Trade_bottom from "@/components/trade/trade_bottom/trade_bottom";
  import Trade_main from "@/components/trade/trade_main/trade_main";
  import { mapGetters,mapMutations,mapActions } from 'vuex'
  import Strategy_sidebar from "../../components/strategy_sidebar/strategy_sidebar";
    export default {
      name: "trade",
      metaInfo:{
        title:'火币量化交易',
        titleTemplate: '%s |量化交易 ',
        meta: [
          { charset: 'utf-8' },
          { name: 'description', content: 'foo' },
          {keyword: '量化交易'}
        ]
      },
      components: {
        Strategy_sidebar,
        Trade_main,
        Trade_bottom,
        Trade_header,
        base_com,
      },
      data(){
        return{
          price:{
            now:'',//最新价格
            index:'',//指数价格
            price_of_stop_profit_and_stop_loss:'',//系统使用的价格
            ema:''
          },
          contractSelected: '',
          clientSelected: '',
        }
      },
      created(){
        if(this.get_client() != ''){
          this.clientSelected = this.get_client();
        }else {
          this.clientSelected = '';
        }
        if( this.get_contract() != ''){
         this.contractSelected = this.get_contract();
        }else{
          this.contractSelected = '';
        }
        this.set_strategy('循环策略');
      },
      beforeDestroy(){
        clearInterval(this.get_Interval_get_price());
        clearInterval(this.get_Interval_getListStrategy());
        clearInterval(this.get_Interval_getClientInfo())
      },
      methods:{
        ...mapGetters([
          'get_client',
          'get_contract',
          'get_Interval_getListStrategy',
          'get_Interval_getClientInfo',
          'get_Interval_get_price',
        ]),
        ...mapMutations([
          'set_strategy',
        ]),
        ...mapActions([
          'getPricePro',
        ]),
        //获取最新价格，指数价格
        getPrice2(){
          this.getPricePro({}).then(res =>{
            console.log(res);
          }).catch(err =>{
            console.log(err)
          })
        },
      },
      computed:{
        computed_client(){   //vux要监听对象
          return this.get_client()
        },
        computed_contract(){
          return this.get_contract()
        },
        client_and_contract(){   //如果client和contract都发生改变执行
          const  { clientSelected,contractSelected} = this;
          return {
            clientSelected,
            contractSelected
          }
        },
      },
      watch:{
        computed_client(){
          this.clientSelected = this.get_client();
        },
        computed_contract(){
          this.contractSelected = this.get_contract()
        },
        client_and_contract(){ //获取到用户id和合约后执行的方法
          if(this.clientSelected !== '' && this.contractSelected !=='' && this.contractSelected !==undefined){
            this.getPrice2();
          }
        },
      }
    }
</script>


<style scoped lang="less">

</style>
